<template>
	<div class="waitpay-wrap">
		<div class="waitpay-head">
			<a href="#/mytao"><i class="fa fa-angle-left"></i></a>
			<span>待收货</span>
		</div>
		<div class="waitpay-main" v-for="item in waitshou">
			
			<ul class="wait-main-ul">
				<li class="wait-main-li">
					<div class="every">
					<p class="waitsell"><i class="fa fa-adjust"></i>{{item.author}} <span class="waitbuy">等待买家收货 </span></p>
					<img :src="/taobao/+item.shopImg" alt="" />
					<div class="beijing">
						<span class="waititle">{{item.title}} <b>¥{{item.price}}</b></span>
					<span class="waitcount">x{{item.buyCount}}</span>
					<span class="waitui">七天退换</span>
					</div>
					</div>
					<div class="waitzeng">
						<p>
							增值服务:全国联保   
							<span> ¥0.00</span><br /> <i class="num">x1</i>
						</p>
						
						<p>
							运费险<span>¥0.00</span> <br /><i class="num">x1</i>
							<b>确认收货前退货可理赔</b> 
						</p>
						<p class="count"><span>共{{item.buyCount}}件商品 合计:¥{{item.buyCount*item.price}}(含运费¥0.00)</span></p>
					</div>
					<div class="quxiao">
						<p class="quxiao-main">
						
							<a @click="shouhuo($event,item._id)">确认收货</a>
						</p>
						
					</div>
				</li>
			</ul>
		</div>
		
	</div>
</template>

<script>
	import $ from 'jquery'
	import axios from 'axios'
	import { mapState } from 'vuex'
	export default {
		data() {
			return {
				waitshou:[],
				
			
			}
		},
		mounted(){
			this.waitshoushop()
		},
		methods:{
			waitshoushop(){
				var that = this;
				
				axios.post('/taobao/waitshou').then(function(result){
					var res = result.data.result;
//					console.log(res);
					that.waitshou = res.data;		
				})
			},
			
			shouhuo(ev,id){
				var that = this;
				var id = id;
				axios.post('/taobao/waitshouhuo',{_id:id}).then(function(result){
					var res = result.data;
					console.log(res);
					
					if(res.error == '0'){
						location.href="#/waitping";
					}
////					
//					that.waitgo = res.data;	
				})
			}
		},
//		
		
	}
</script>

<style scoped="">
.waitpay-wrap {
		margin-bottom: 200px;
		background: #eee;
		height: 100%;
	}
	.waitpay-head {
		height: 30px;
		line-height: 30px;
		color: #fff;
		background: orange;
		text-align: center;
		font-size: 15px;
	}
	.waitpay-head i{
		float: left;
		
		font-size: 20px;
		padding: 5px;
	}
	.waitpay-main{
		background: #fff;
		
		font-size: 15px;
	}
	.waitpay-main img {
		height: 80px ;
		width: 80px;
		float: left;	
		margin-right: 5px;			
	}
	.wait-main-li {
		
		margin: 10px 0;
	}
	.every{
		padding: 0 15px;
		overflow: hidden;
	}
	.waitbuy{
		float: right;
		color: orangered;
		font-size: 13px;
		opacity: 0.8;
	}
	.waitsell {
		display: block;
		height: 35px;
		line-height: 35px;
	}
	.waititle,.waitcount {
		color: #666;
		display: block;
	}
	.waititle b{
		float: right;
		color: #000;
		font-weight: normal;
	}
	.waitcount{
		float: right;
	}
	
	.waitui {
		border: solid 1px orangered;
		float: left;
		border-radius: 5px;
		color: orangered;
		font-size: 10px;
		font-weight: 600;
		margin-top: 20px;
	}
	.waitzeng{
		color: #555;
		line-height: 25px;	
		margin-top: 15px;
		font-size: 12px;
		overflow: hidden;
	}
	.waitzeng p{
		padding: 0 15px;
		overflow: hidden;
		border-bottom:solid 1px #eee ;
	}
	.waitzeng p b{
		width: 130px;
		display: block;
		color: #999;
	}
	.waitzeng p span{
		float:  right;
	}
	.num {
		color: #999;
		font-style:normal ;
		float: right;
		display: block;
	}
	.count{
		float: right;
		width: 100%;
		height: 30px;
		line-height: 30px;
		color: #333;
	}
	.quxiao{
		overflow: hidden;
		border-bottom:solid 1px #eee ;
		width: 100%;
	}
	.quxiao-main {
		padding: 0 15px;
		float: right;
		height: 33px;
		line-height: 33px;
		font-size: 12px;		
	}
	.quxiao-main span,.quxiao-main a {
		border: solid 1px #999;
		border-radius:12px ;
		padding:2px 6px ;
		cursor: pointer;
	}
	.quxiao-main a{
		border-color: orangered;
		color: orangered;
		margin-left: 10px;
		padding:2px 18px ;
		
	}
</style>